<template>
    <div class="member-survey">
        <i-card>
            <member-search></member-search>
            <i-table
                border 
                :columns="columns">
            </i-table>
            <footer class="table-footer">
                <div></div>
                <i-page 
                    :total="40"  
                    show-elevator 
                    show-sizer>
                </i-page>
            </footer>
        </i-card>
    </div>
</template>
<script>
// custom components
import MemberSearch from './components/MemberSearch'

export default {
    name: 'member-survey',
    data() {
        return {
            columns: [
                {
                    type: 'selection',
                    width: 55,
                    align: 'center'
                },
                {
                    title: '昵称',
                    key: 'name'
                },
                {
                    title: '手机号/邮箱',
                    key: 'telEmail'
                },
                {
                    title: '微信号/昵称',
                    key: 'weChat'
                },
                {
                    title: '会员卡',
                    key: 'memberCard'
                },
                {
                    title: '等级',
                    key: 'grade',
                    sortable: true
                },
                {
                    title: '积分',
                    key: 'integral',
                    sortable: true
                },
                {
                    title: '管理',
                    key: 'management',
                    align: 'center',
                    render: (h, params) => {
                        return (
                            <div>
                                <i-button size="small" type="error">
                                    <i-icon type="trash-a" size={14} />
                                </i-button>
                            </div>
                        )
                    }
                }
            ]
        }
    },
    components: {
        MemberSearch
    }
}
</script>
<style lang="less" scoped>
@import '~@/assets/style/theme/index';
.table-footer {
    display: flex;
    justify-content: space-between;
    margin-top: @gap;
}
</style>


